<!DOCTYPE html>
<html lang="en">
<link>

    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Return_Order_OrderItem_List管理</title>
    <meta name="description" content="Return_Order_OrderItem_List管理">
    <meta name="keywords" content="Return_Order_OrderItem_List管理">
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">

    <!-- 引入样式/组件 -->
    <link rel="icon" href="../img/favicon.ico">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="../css/style.css">
    <link rel="stylesheet" href="../css/elementui.css"/>
    <script src="../js/vue.js"></script>
    <script src="../js/elementui.js"></script>
    <script src="../js/axios.js"></script>
    <script src="../js/util.js"></script>

<body class="hold-transition">

<div id="app">

    <div class="content-header">
        <h1>Return_Order_OrderItem_List管理<small>Return_Order_OrderItem_List管理</small></h1>
        <el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>Return_Order_OrderItem_List管理</el-breadcrumb-item>
            <el-breadcrumb-item>Return_Order_OrderItem_List管理</el-breadcrumb-item>
        </el-breadcrumb>
    </div>

    <div class="app-container">
        <div class="box">
            <div class="filter-container">
            <!--查询表单-->
            <el-form :inline="true">
                <el-form-item label="订单号">
                    <el-input v-model="searchMap.id" placeholder="订单号" class="filter-item">
                    </el-input>
                </el-form-item>
                <el-button type="primary" @click="findPage()">查询</el-button>
            </el-form>
            </div>

            <el-table :data="tableData"
                      style="width:100%">
                <el-table-column
                                        prop="id"
                                        label="ID/订单号"
                                        width="180">
                </el-table-column>
                <el-table-column
                                        prop="applyTime"
                                        label="申请时间"
                                        width="180">
                </el-table-column>
                <el-table-column
                                        prop="returnMoney"
                                        label="退款金额"
                                        width="180">
                </el-table-column>
                <el-table-column
                                        prop="linkman"
                                        label="联系人"
                                        width="180">
                </el-table-column>
                <el-table-column

                                        label="申请状态"
                                        width="180">

                    <template slot-scope="scope">
                        <span v-if="scope.row.status == '0'">申请</span>
                        <span v-else-if="scope.row.status == '1'">同意</span>
                        <span v-else-if="scope.row.status == '2'">驳回</span>
                        <span v-else>数据错误</span>
                    </template>

                </el-table-column>
                <el-table-column

                                        label="操作"
                                        width="180">

                    <template slot-scope="scope">
                        <el-button @click="detail(scope.row.id)" size="mini" type="primary" size="small">查看详情</el-button>
                    </template>

                </el-table-column>
            </el-table>

            <div class="pagination-container">
                <el-pagination @size-change="findPage"
                               @current-change="findPage"
                               :current-page.sync="currentPage"
                               :page-sizes="[10,30,50,100]"
                               :page-size="size"
                               layout="total,sizes,prev,pager,next,jumper"
                               :total="total">
                 </el-pagination>
            </div>

        </div>
    </div>
</div>

<script>
    new Vue({
        el: "#app",
        data:{
            tableData:[],
            currentPage:1,
            size:10,
            total:10,
            searchMap:{}
        },
        created(){
            this.findPage();
        },
        methods:{
            detail(id){
                location.href = "return_order_orderItem_detail.html?rid="+id;
            },
            findPage(){
                axios.post(`/return/findPage.do?page=${this.currentPage}&&size=${this.size}`,this.searchMap).then( res=>{
                        this.tableData = res.data.rows;
                        this.total = res.data.total;
                })
            }
        }
    })
</script>

</body>
</html>